<!--# layout("/common/layout.html",{"jsBase":"/js/contract/contractInfo/"}){ -->

<style type="text/css">
    .ttdHeader {
        width: 300px;
        height: 80px;
    }
      .ttd {
          width: 300px;
          height: 150px;
      }
        .ttd p {
            margin-top: 10px;
        }

</style>
<div id="ProcessTable">


    <table style="table-layout: fixed;width: 800px;margin-left: 35%" class="layui-table" lay-skin=" " id="table1">
        <colgroup>
            <col width="300">
            <col width="300">
            <col width="200">
            <col width="200">
            <col width="200">
        </colgroup>
        <tbody name="tbodyTemplate">
        <tr>
            <td colspan="2"></td>
        </tr>
        <tr>
            <th style="width: 300px" id="conid" contractid="111">{{HeaderTable.graduateYear}}届-−{{HeaderTable.studentName}} </th>
            <th>家长电话 <span style="float: right;"> {{HeaderTable.customerPhone}} </span> </th>
        </tr>
        <tr>
            <td class="ttdHeader">
                <p>省份:
                    <span style="float: right;" v-if="HeaderTable.schoolExt.length>2"> {{ JSON.parse(HeaderTable.schoolExt).prov }}</span>
                    <span style="float: right;" v-else> </span>
                </p>
                <p>考试类别:
                    <span style="float: right;" v-if="HeaderTable.schoolExt.length>2">{{ JSON.parse(HeaderTable.schoolExt).majorType }}</span>
                    <span style="float: right;" v-else ></span>
                </p>
            </td>
            <td class="ttdHeader">
                <p>服务类型: <span style="float: right;"> {{HeaderTable.btypename}}</span> </p>
            </td>
        </tr>
        </tbody>

    </table>


    <table class="layui-table">

        <template v-for="(item,index) in PropressNodeList">
            <thead>
            <tr style="background: #CCCCCC; height: 15px;">
                <td colspan="6"></td>
            </tr>
            </thead>
            <tbody name="tbodyTemplate">
            <tr>
                <td class="ttd">
                    {{item.csort}}
                </td>
                <td class="ttd">
                    {{item.cnodename}}
                </td>
                <td class="ttd">
                    服务老师：  {{item.teacher}}
                </td>
                <td class="ttd">
                    <div>
                        <span>服务详情</span>
                        <p v-html="item.content"></p>
                    </div>
                </td>
                <td class="ttd">
                    <div><a>附件 </a>
                        <li v-for="(item2,index2) in item.files.split(';') " :key="index2">
<!--replace('/opt/static','http://static.51sdx.com/images')-->
                            <a name="thisfile" href="#" v-bind:href1="item2.replace('/opt/static','http://static.51sdx.com/images')"> {{ item2.substr(item2.lastIndexOf('/')+1 )   }}</a>
                        </li>
                    </div>
                </td>
                <td class="ttd">

                        <div v-if="item.nodeSchedule==0">

                            <div v-if="item.csort == maxsort+1 || (item.csort==1 && maxsort==-2)  ">
                                <button style="margin-left: 20px" name="startService"
                                        v-bind:acontractid="item.acontractid"
                                        v-bind:cserviceid="item.cserviceid"
                                        v-bind:cnodeid="item.cnodeid"
                                        v-bind:trIndex="item.csort"
                                        id="startService" class="layui-btn layui-btn-radius layui-btn-primary">开始服务</button>
                            </div>

                            <div v-else>
                                <button style="margin-left: 20px"
                                        v-bind:acontractid="item.acontractid"
                                        v-bind:cserviceid="item.cserviceid"
                                        v-bind:cnodeid="item.cnodeid"
                                        v-bind:trIndex="item.csort"
                                        name="noService"  id="noService" class="layui-btn layui-btn-radius layui-btn-disabled">未开始</button>
                            </div>

                        </div>
                        <div v-else-if="item.nodeSchedule==1">
                            <button style="margin-left: 20px"
                                    v-bind:acontractid="item.acontractid"
                                    v-bind:cserviceid="item.cserviceid"
                                    v-bind:cnodeid="item.cnodeid"
                                    v-bind:trIndex="item.csort"
                                    name="doService" id="doService" class="layui-btn layui-btn-radius layui-btn-primary">进行中</button>

                            <button style="margin-left: 20px"
                                    v-bind:acontractid="item.acontractid"
                                    v-bind:cserviceid="item.cserviceid"
                                    v-bind:cnodeid="item.cnodeid"
                                    v-bind:trIndex="item.csort"
                                    name="nextSchedule" id="nextSchedule" class="layui-btn layui-btn-radius layui-btn-primary">完成服务</button>
                        </div>
                        <div v-else-if="item.nodeSchedule==2">
                            <button style="margin-left: 20px"
                                    v-bind:acontractid="item.acontractid"
                                    v-bind:cserviceid="item.cserviceid"
                                    v-bind:cnodeid="item.cnodeid"
                                    v-bind:trIndex="item.csort"
                                    name="endService" id="endService" class="layui-btn layui-btn-radius layui-btn-disabled">已完成</button>
                        </div>


                </td>
            </tr>
            </tbody>

        </template>

    </table>

</div>



<!--footer-->
<script>

</script>
<script type="text/javascript">
    layui.use(['jquery','form','table','upload','laytpl'],function () {
        var $ = layui.jquery;
        var form = layui.form;
        var table = layui.table;
        var upload = layui.upload;
        var laytpl = layui.laytpl;
        var layer = layui.layer;

        window.processList = ${processList};
        console.dir(processList);
        // 头部显示表格
        var parentobj = window.parent.ServicesList;
        var parentIndex = window.parent.index;

        var vm2 = new Vue({
            el: "#ProcessTable",
            data: {
                HeaderTable :parentobj[parentIndex],
                PropressNodeList: processList,
                maxsort:0,
                maxnode:0
            }
        });

        console.log(vm2.HeaderTable)

        var node2arr = new Array(); //当前已完成的最大id
        var nodemap = new Map();
        for(var i in processList){
            console.log("nodeschedult: "+processList[i].nodeSchedule)
            if(processList[i].nodeSchedule==2){
                console.log("map设置值")
                nodemap.set(processList[i].csort,processList[i].cnodeid)
            }
        };

        console.log(nodemap)
        console.log(Object.keys(nodemap).length==0)

        if (nodemap.size==0){
            vm2.maxsort=-2;
        }else{
            nodemap.forEach(function(value,key){//找出最大的节点
                if(key>vm2.maxsort){
                    vm2.maxsort=key;
                    vm2.maxnode=value;
                }
            })
        }
        console.log("maxsort: "+vm2.maxsort)

        // 打开查看窗口
        window.isHiddenButton = true;
        window.indexNodeSchedule=new Object();
        $(document).on('click','#startService,#doService,#selectStartSchedule',function(){
            if( $(this).attr('id') == 'selectStartSchedule'  ){
                console.log("不需要按钮")
                isHiddenButton = false;
            }else {
                console.log("需要按钮")
                isHiddenButton = true;
            }
            var contractid =$(this).attr('acontractid');
            var srviceid = $(this).attr('cserviceid');
            var nodeid = $(this).attr('cnodeid');
            indexNodeSchedule["contractid"]=contractid;
            indexNodeSchedule["srviceid"]=srviceid;
            indexNodeSchedule["nodeid"]=nodeid;
            indexNodeSchedule["trIndex"]=$(this).attr('trIndex');
            console.dir(indexNodeSchedule)

            layer.open({
                type:2
                ,title:"请输入服务详情"
                ,area:['800px','600px']
                ,content:['/admin/contract/createcontract/openifream.do']

            })
        })

        // 点击 完成服务事件
        $(document).on('click','#nextSchedule',function(){
            var inde =  $(this).attr("trindex") ;
            var dataobj = processList[inde-1]//排序 sort -1
            dataobj["newNodeSchedule"]=2;
            console.dir(dataobj)

            layer.confirm( '是否确认完成此服务，确认完成不可修改！'
                ,{icon:3,title:'是否确认完成'}
                ,function (index) {
                    $.ajax({
                        url: Common.ctxPath+'/contract/createcontract/updateNodeSchedule.json'
                        ,type:'POST'
                        ,contentType:'application/json'
                        ,data:JSON.stringify(dataobj)
                        ,dataType:'text'
                        ,success:function (data) {
                            console.log(data)
                            window.location.reload();
                        }
                    })
                }
            );

        })
        //鼠标事件

        $(document).on('click','a[name="thisfile"]',function () {
            var url = $(this).attr('href1');
            window.open(url)
        })


        $('button#endService').on({
            mouseover:function () {
                $(this).removeClass("layui-btn-disabled");
                $(this).attr("id","selectStartSchedule");
                $(this).text("查看")

            },
            mouseout:function () {
               $(this).addClass("layui-btn-disabled")
                $(this).attr("id","endService")
                $(this).text("已完成")

            }
        })

    })

</script>


<!--#} -->
